<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />  
<meta http-equiv="Pragma" content="no-cache" />  
<meta http-equiv="Expires" content="0" /> 
<meta charset="utf-8" name="viewport"
	content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>资讯中心</title>
 	<link rel="stylesheet" href="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrap/dist/css/bootstrap.min.css">  
    <link href="http://carowner.yonyouauto.com/fs01/ase/v1/components/mobisscroll/css/mobiscroll.custom-3.0.0-beta2.min.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrapValidator/css/bootstrapValidator.css" type="text/css" />
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/jquery2.1.1/jquery.min.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/py.js"></script>
	<script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrap/dist/js/bootstrap.min.js"></script>
    <script src="http://carowner.yonyouauto.com/fs01/ase/v1/components/mobisscroll/js/mobiscroll.custom-3.0.0-beta2.min.js" type="text/javascript"></script>
    
    <script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/hammer/hammer.min.js"></script>
    <script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/components/hammer/jquery.hammer.js"></script>
    
    <script src="http://carowner.yonyouauto.com/fs01/ase/v1/components/bootstrapValidator/js/bootstrapValidator.js"></script>
     <script src="http://carowner.yonyouauto.com/fs01/ase/v1/components/vue/vue.min.js"></script>
    <script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/common.js"></script>
    <script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/Gmccui.js"></script>
    
    <script type="text/javascript" src="http://carowner.yonyouauto.com/fs01/ase/v1/js/common/wechatCommon.js"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=6WLRtwjdIPrXW5FaNIsgdZG038pLb84Z"></script>
	<style> 
a{ text-decoration:none;color:#000;}
.product-head h1{font-size: 14px;font-family: Arial, Helvetica, sans-serif;margin-bottom: 3px;margin-left: 3px;}
.product-head{font-size: 12px;padding: 4px;background-color: #ccc;width: 235px;}
.filterform input{font-size: 15px;padding: 3px;border: 1px solid #999;}
/* li{padding: 0;margin: 3px;list-style: none;width: 100%;}
li a{color: #000;font-family: Arial, Helvetica, sans-serif;font-size: 11px} */
ul{margin: 0;padding: 0;}
.clear{clear: both;}
body{background-color:#fff;color:#777;}
.nav-pills>li{
	width:49%;
	text-align: center;
}
.nav-pills>li>a{
    font-size: 16px;
}
.nav-pills>li.active>a, .nav-pills>li.active>a:focus, .nav-pills>li.active>a:hover{
	color: #f33a3a;
    background-color: transparent;
    border-bottom: 1px solid red;
    border-radius: 0px;
}

.item-wrap .item{
	width:100%;
	min-height:80px;
	background-color:#fff;
	padding: 10px 0px;
	border-bottom:1px solid #ddd;
}

.item-wrap>.item:last-child{
	border-bottom:1px solid #fff;
}

.flag{
	padding:2px 5px;
	border:1px solid red;
	color:red;
	border-radius: 3px;
	letter-spacing: 2px;
}

.flag-o{
	color:red;
	border-radius: 3px;
	letter-spacing: 2px;
}

.flag-o-gray{
	color:#333;
}


.drivider-line-1{
	height:1px;
	display:inline-block;
	width:100%;
	background-color:#ddd;
	margin:0 0 5px;
	
}
.drivider-line-10{
	height: 10px;
	display: inline-block;
	width: 100%;
	background-color: #f6f6f6;
	margin: 0px 0px 5px;	
}

.border-dash-1{
	width:100%;
	display:block;
	border:1px dashed #ddd;
	min-height:100px;
	border-radius: 2px;
}

.font-red,.font-red *{
	color:#ea0707;
}
.wd-80{
	width:80%;
}

#syscontent{
	position:absolute;
	height:100%;
	width:auto;
	background-color:#fff;
}

.padding-top-15{
	padding-top:15px;
}

.padding-top-10{
	padding-top:10px;
}

.padding-15{
	padding:15px;
}
.padding-tb-10{
	padding:10px 0px;
}
.line-h-30{
	line-height: 30px;
}

a.zx-item{
	display:inline-block;
	width:100%;
	padding:5px;
}

a.zx-item img,.zxxx-img,.hdxx-img{
	width:100%;
	border-radius:0px;
}

a.zx-item span[class^="dsp_text"]{
	color:#555;
	line-height: 27px;
}
a.zx-item span.dsp_text_light{
	color:#989595;
}
a.zx-item:after {
    width: 100%;
    height: 10px;
    display: inline-block;
    background-color: #fffffd;
    content: "";
}
.top-header{
	width: 100%;
    display: inline-block;
    background: url(http://carowner.yonyouauto.com/fs01/ase/v1/images/GQ/td1.png) 10px 12px no-repeat;
    background-size: 15px 15px;
    height: 35px;
    background-color: #3d3d3d;
    color: #fff;
    padding: 10px 30px;
    letter-spacing: 2px;
    font-size: 16px;
}
.news-content{
	line-height:25px;
	color:#777;
}
.news-caption{
	color:#989595;
	line-height: 30px;
}
.comments{
	background: #fafafa;
    padding-top: 10px;
    margin-top: 10px;
    border-top: 1px solid #ddd;
}
.comments .control-label{
	line-height:25px;
}
.wt-btn{
	margin-top: -20px;
    float: right;
}
h4.hdxq-title:before{
	content: "|";
    margin-left: -15px;
    margin-right: 10px;
    color: red;
}
.hdxx_inner .form-group{
	margin-bottom:0px;
}

.hdxx_inner .control-label{
	    padding-top: 7px;
}
p.hdxq_dsp{
	text-indent:28px;
}

.max-img{
	width: 130px;
	height: 90px;
	margin-top: 0px;
	margin-right: 1px;
	margin-left: 1px;
	margin-bottom: 0px;
	max-width: 130px;
}

.max-img>img{
	width:100%;
	height:100%;
	border-radius:0px;
}

.max-v-img{
	width: 100%;
    height: 160px;
    margin: 0px 0px;
   
}

.max-v-img>img{
	width:100%;
	height:100%;
	border-radius:0px;
}
    </style> 
<script type="text/javascript">

</script>
</head>
<body style="background-color: #f6f6f6;">    
<div id="actContent" class="container" style="overflow-x:hidden;">
<!-- 	<div class="row">
    	<div class="top-header">活动中心</div>
    </div> -->
    
    <div class="row" style="background-color: #FFFFFF; ">
		<div class="col-xs-12" style="border-bottom: 1px solid #eee;">
			<ul id="activity" class="nav nav-pills">
					<li id="zx1" class="active" style="width:100%;">
						<a href="#zx" data-toggle="tab" style="color:#000;border:none;">资讯</a>
					</li>
					<!--<li id="hd1">-->
						<!--<a href="#hd" data-toggle="tab">活动</a>-->
					<!--</li>-->
				</ul>
		</div>
		<div class="drivider-line-10"></div>
		<div class="col-xs-12">
			<div id="myTabContent" class="tab-content">
		<div class="tab-pane fade in active" id="zx">
		<!-- 资讯列表 -->
			<div class="row">
				<div class="col-xs-12" v-for="zx in zxList">
					<a class="zx-item" href="javascript:void(0)" v-on:click="zxSkip(zx['naiId'],zx['potentialUserId'],zx['titile'],zx['titleImage'])">
						<div class="row">
							<div class="col-xs-12 text-center">
								<div class="max-v-img">
								<img class="img-rounded" v-bind:src="zx['titleImage']">
								</div>
							</div>
						</div>
						
						<div class="row padding-tb-10">
							<div class="col-xs-12">
								<span class="flag pull-left">资讯</span>
								<span class="dsp_text" v-text="zx['titile']" style="padding-left: 15px;line-height: 26px;"></span>
							</div>
							<!-- <div class="col-xs-3 text-right">
								<span class="dsp_text_light">4小时前</span>
							</div> -->
						</div>
						
						
					</a>
				</div>
			</div>
		<!-- 资讯列表结束 -->
		</div>

		
		</div>
		</div>
    </div>	
	
</div>
	
	<!-- 资讯详情开始 -->
			<div id="zxxqContent" class="container hidden">
				<div class="row">
					<div class="top-header">资讯详情</div>
				</div>
				<div class="row">
				<div class="col-xs-12">
				
					<h4>售价15.98-22.38万，广汽三菱欧蓝德正式上市</h4>
					<small class="news-caption">2017/3/27 08:03</small>
					<p class="news-content">
					2016年购置税减半政策自颁布以来，为广大车主提供了巨大的购车优惠，平均每位车主可少缴纳4500元的购车税。可来到2017，购置税减半政策过期，没有了国家的“庇佑”，年后购车就一定亏吗？非也！广汽三菱“特惠‘炫’风，劲爆来袭”活动现已全面开启，凡在2-6月期间，购买全新劲炫1.6L车型即可享购置税减半，购买2.0L车型可享购置税75折，让你无惧购置税的退潮。除了购置税“减负”，3年0利率贷款购车福利亦“卷土重来”，让心仪全新劲炫的消费者购车“0负担”。

					作为开春第一股特惠“炫”风，优惠风潮还将“席卷”用车生活。购买全新劲炫的新车主们可享优于同级的5年15次免费常规保养，每次保养包含机油机滤、48项常规检查、工时费用在内的常规保养费用，让用车生活后顾无忧。以每次保养花费360元为例，5年期间将节省高达5400元保养费用，结合当前的油价，相当于节省近1吨93号汽油费，优惠力度可谓“劲”道十足。
					</p>
					<div class="row">
							<div class="col-xs-12 text-center">
								<img class="img-rounded zxxx-img" src="http://carowner.yonyouauto.com/fs01/ase/v1/images/zixun.png">
							</div>
					</div>
				
				</div>
			</div>
			<div class="row comments">
				<div class="col-xs-12">
					<div class="form-horizontal">
						<div class="form-group">
						    <div class="col-xs-12">
						    	<h5>请留下您的信息</h5>
						    </div>
						  </div>
						  <div class="form-group">
						    <label class="col-xs-2 control-label">姓名</label>
						    <div class="col-xs-4">
						    <input type="text" class="form-control input-sm">
						    </div>
						    <label class="col-xs-2 control-label">电话</label>
						    <div class="col-xs-4">
						    <input type="text" class="form-control input-sm">
						    </div>
						  </div>
						  <div class="form-group">
						  	<div class="col-xs-12">
						  		<button type="button" class="btn btn-danger col-xs-12">提交</button>
						  	</div>
						  </div>
					</div>
				</div>
			</div>
			</div>
		<!-- 资讯详情结束 -->
	
	
	<!-- 活动详情开始 -->
			<div id="hdxqContent" class="container hidden">
				<div class="row">
					<div class="top-header">活动详情</div>
				</div>
				<div class="row padding-tb-10">
					<div class="col-xs-12">
						<img class="img-rounded hdxx-img" src="http://carowner.yonyouauto.com/fs01/ase/v1/images/zixun.png">
					</div>
					<div class="col-xs-12">
						<h4>{{GC_BEGIN_DATE}}</h4>
					</div>
					<div class="col-xs-8">
						<small>活动人数：已参加20人</small>
					</div>
					<div class="col-xs-4">
						<button type="button" class="btn btn-danger wt-btn">我要参加</button>
					</div>
					
				</div>
				<div class="row">
					<div class="drivider-line-10"></div>
					<div class="col-xs-12">
						<h4 class="hdxq-title">活动信息</h4>
					</div>
					<div class="col-xs-12">
						<div class="form-horizontal hdxx_inner">
						  <div class="form-group">
						    <label class="col-xs-2 control-label">电话</label>
						    <div class="col-xs-10">
						      <p class="form-control-static"><a href="tel:400-9773030">400-9773030</a></p>
						    </div>
						  </div>
						  <div class="form-group">
						    <label class="col-xs-2 control-label">时间</label>
						    <div class="col-xs-10">
						      <p class="form-control-static">2016-09-30至2016-11-10</p>
						    </div>
						  </div>
						  <div class="form-group">
						    <label class="col-xs-2 control-label">销售店</label>
						    <div class="col-xs-10">
						      <p class="form-control-static">广汽三菱上海嘉顺店</p>
						    </div>
						  </div>
						  <div class="form-group">
						    <label class="col-xs-2 control-label">地点</label>
						    <div class="col-xs-10">
						      <p class="form-control-static">上海市嘉定区祁连路2199号1层C区</p>
						    </div>
						  </div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="drivider-line-10"></div>
					<div class="col-xs-12">
						<h4 class="hdxq-title">活动介绍</h4>
					</div>
					<div class="col-xs-12">
						<p class="hdxq_dsp">
							现如今，要论汽车市场的当红炸子鸡，非城市SUV莫属！既具备城市行驶性能，又兼顾大空间和高通过性，让城市SUV几乎没有被拒绝的理由。而要说起城市SUV，就不能不提三菱欧蓝德这款最早提出跨界理念的车型之一。
						</p>
					</div>
				</div>
				
			</div>
	<!-- 活动详情结束 -->
	
<script>

//liyh1 2017-04-06
$(function(){
	var flag = GetQueryString('flag');
	if(flag == '1'){
		$("#zx1").removeClass('active');
		$("#hd1").addClass('active');
		$("#zx").attr('class','tab-pane fade');
		$("#hd").attr('class','tab-pane fade in active');
	}
});

var Gmccui = new Gmccui();
var apiUrl = [
	{"id":"zxList","url":"myNews"},//资讯列表
	{"id":"hdList","url":"myActivities"},//粉丝活动列表
	{"id":"newsContent","url":"newsContent"}//活动详情
];
var actContentData = {"zxList":[],"hdList":[]};

Gmccui.setHeaderMap({"Cookie":document.cookie});
Gmccui.setDomainUrl(getRootPath()+"/information/api/v1/");
//Gmccui.setDomainUrl("http://10.180.104.192:9002/information/api/v1/");
Gmccui.setMutiApi(apiUrl);
Gmccui.getData("zxList",{"activityType":1},function(_callback){
	actContentData.zxList = _callback;
})
Gmccui.getData("hdList",function(_callback){
	actContentData.hdList = _callback;
})
 new Vue({
            el: '#actContent',
            data: actContentData,
            methods:{zxSkip:function(naiId,potentialUserId,titile,titleImage){
       	 				var title = encodeURI(titile);
		            	var zxUrl = '/wx/views/sharepage/informationView.html?naiId='+naiId+'&potentialUserId='+potentialUserId+'&title='+title+'&imgUrl='+titleImage;
		            	Gmccui.goto(zxUrl);
           	 		},
           	 		hdSkip:function(nailId,potentiallUserId,titile1,titleImage1){
           	 		var title = encodeURI(titile1);
           	 		var hdUrl = '/wx/views/sharepage/activityView.html?naiId='+nailId+'&potentialUserId='+potentiallUserId+'&title='+title+'&imgUrl='+titleImage1;
	            	Gmccui.goto(hdUrl);
           	 		}
 			}
        });
      




/**
 *liyh1 2017-04-06
 *判断是活动还是资讯
 */

 function GetQueryString(name)
 {
      var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");
      var r = window.location.search.substr(1).match(reg);
      if(r!=null)return  unescape(r[2]); return null;
 }
</script>
</body>

</html>